<template>
  <div class="boxs">
    <div class="content">
      <!-- 行业选择弹框 -->
      <el-cascader
        collapse-tags
        clearable
        ref="postSelectRef"
        :props="{
          expandTrigger: 'hover',
          multiple: true,
        }"
        v-model="remit.industryType"
        :show-all-levels="false"
        placeholder="试试搜索：制造业"
        :options="industryInfo"
        filterable
        @change="industry($event)"
      ></el-cascader>
      <!-- 行业选择弹框 -->
      <el-cascader
        collapse-tags
        clearable
        ref="postSelectRef"
        :props="{
          expandTrigger: 'hover',
          multiple: true,
          emitPath: false,
        }"
        v-model="remit.cityData"
        :show-all-levels="false"
        placeholder="试试搜索：上海市"
        :options="cityData"
        filterable
        @change="cityStry($event)"
      ></el-cascader>
      <h1 v-show="cn">{{ cn }}</h1>
      <h1 v-show="cityCN">{{ cityCN }}</h1>
    </div>
  </div>
</template>

<script>
import { industryInfo, cityData } from "@/utils/option.js";
export default {
  data() {
    return {
      industryInfo: industryInfo,
      cn: "",
      Code: "",
      cityData: cityData,
      cityCN: "",
      cityCode: "",
      remit: {
        industryType: null,
        cityData: null,
      },
    };
  },
  methods: {
    // 选择行业类型
    industry(val) {
      let a = [];
      let industryTypeCN = [];
      let industryTypeCode = [];
      for (let i = 0; i < val.length; i++) {
        a.push(...val[i]);
      }
      a = Array.from(new Set(a));
      for (let i = 0; i < a.length; i++) {
        industryTypeCode.push(a[i].split("-")[0]);
        industryTypeCN.push(a[i].split("-")[1]);
      }
      this.cn = industryTypeCN.join(",");
      this.Code = industryTypeCode.join(",");
    },
    cityStry(val) {
      let cityCN = [];
      let cityCode = [];
      for (let i = 0; i < val.length; i++) {
        cityCode.push(val[i].split("-")[0]);
        cityCN.push(val[i].split("-")[1]);
      }
      this.cityCN = cityCN.join(",");
      this.cityCode = cityCode.join(",");
      console.log(this.cityCode);
    },
  },
};
</script>

<style lang="scss" scoped>
.boxs {
  width: 100%;
  height: 100vh;
  .content {
    width: 1200px;
    height: 800px;
    margin: 50px auto;
    h1 {
      margin-top: 300px;
    }
  }
}
::v-deep .el-cascader {
  width: 500px;
}
</style>
